GermanWikipedia - /page/entry.mu

Micron Document

<!DOCTYPE html>

<title>Webformular</title>

</head>

<h1 id="firstHeading" class="firstHeading mw-first-heading"><span class="mw-page-title-main">Webformular</span></h1>

</header>

</div>

<div id="mw-content-text" class="mw-body-content mw-content-ltr" lang="de" dir="ltr"><div class="mw-content-ltr mw-parser-output" lang="de" dir="ltr"><p>Ein <b>Webformular</b> ist ein <a href="Formular" title="Formular">Formular</a> auf einer <a href="Webseite" title="Webseite">Webseite</a> zur Erfassung von <a href="Daten" title="Daten">Daten</a>, die zur Verarbeitung an einen <a href="Webserver" title="Webserver">Webserver</a> gesendet werden. Man findet sie beispielsweise in <a href="Webmail" title="Webmail">Webmail</a>-Anwendungen, <a href="Suchmaschine" title="Suchmaschine">Suchmaschineneingabefeldern</a>, in <a href="Soziales_Netzwerk_(Internet)" title="Soziales Netzwerk (Internet)">Sozialen Netzwerken</a> oder auf <a href="Login_(Informationstechnik)" title="Login (Informationstechnik)">Login</a>-Seiten. Das Absenden der Daten verläuft über das <a href="Hypertext_Transfer_Protocol" title="Hypertext Transfer Protocol">Hypertext Transfer Protocol</a> via <a href="Hypertext_Transfer_Protocol#HTTP_GET" title="Hypertext Transfer Protocol">HTTP-GET</a>, <a href="Hypertext_Transfer_Protocol#HTTP_POST" title="Hypertext Transfer Protocol">HTTP-POST</a> oder dem <a href="XMLHttpRequest" title="XMLHttpRequest">XMLHttpRequest</a> (<a href="Ajax_(Programmierung)" title="Ajax (Programmierung)">Ajax</a>).

</p>

<div class="mw-heading mw-heading2"><h2 id="Begriff">Begriff</h2></div>

<p><a href="ISO_9241" title="ISO 9241">ISO 9241</a> definiert ein Formular als „strukturierte Darstellung von <a href="Textfeld" title="Textfeld">Feldern</a> und weiteren <a href="Steuerelement" title="Steuerelement">Elementen</a> einer <a href="Benutzerschnittstelle" title="Benutzerschnittstelle">Benutzungsschnittstelle</a>, die der <a href="Benutzer" title="Benutzer">Benutzer</a> liest, die er ausfüllt, für welche er Einträge auswählt oder die er verändert“. Der Begriff ist dabei nicht nur auf Formulare auf Webseiten beschränkt, sondern umfasst <a href="Plattformunabh%C3%A4ngigkeit" title="Plattformunabhängigkeit">unabhängig</a> von <a href="Betriebssystem" title="Betriebssystem">Betriebssystem</a>, Anwendung oder Endgerät sämtliche Formulare, mit denen der Benutzer interagieren kann, oftmals im Verlauf eines <a href="Dialog_(Benutzeroberfl%C3%A4che)" title="Dialog (Benutzeroberfläche)">Dialogs</a><sup id="cite_ref-1" class="reference"><a href="#cite_note-1"><span class="cite-bracket">[</span>1<span class="cite-bracket">]</span></a></sup>.

</p>

<div class="mw-heading mw-heading2"><h2 id="Mögliche_Auswahlfelder"><span id="M.C3.B6gliche_Auswahlfelder"></span>Mögliche Auswahlfelder</h2></div>

<p>Folgende Eingabefelder sind im <a href="HTML" class="mw-redirect" title="HTML">HTML</a>-4-Standard vorgesehen:

</p>

<ul><li><a href="Textbox" class="mw-redirect" title="Textbox">einzeiliges Texteingabefeld</a> (für Freitext)</li>

<li><a href="Kennwort" class="mw-redirect" title="Kennwort">Passwortfeld</a> (Eingaben werden <a href="Maskierungszeichen" title="Maskierungszeichen">maskiert</a> auf dem Bildschirm ausgegeben)</li>

<li>mehrzeiliges Texteingabefeld (<i>Textarea</i>)</li>

<li>Auswahllisten (<a href="Dropdown-Liste" title="Dropdown-Liste">Dropdown-Liste</a>)</li>

<li><a href="Radiobutton" title="Radiobutton">Radiobuttons</a> (Auswahl einer Option aus mehreren)</li>

<li><a href="Checkbox" title="Checkbox">Checkboxen</a> (Auswahl mehrerer Optionen)</li>

<li>Felder zum <a href="Hochladen" class="mw-redirect" title="Hochladen">Datei-Upload</a></li>

<li>versteckte Formularfelder (z. B. für <a href="Session-ID" class="mw-redirect" title="Session-ID">Session-IDs</a>)</li>

<li><a href="Schaltfl%C3%A4che" title="Schaltfläche">Klick-Buttons</a>, dazu gehört auch der Bestätigungsknopf (<i>submit</i>) oder ein Knopf zum Zurücksetzen der Eingaben</li></ul>

<p><a href="HTML5" title="HTML5">HTML5</a> erlaubt weitere Arten von Eingabefeldern, die sich oft zum einzeiligen Eingabefeld nur durch ihre <a href="Semantik" title="Semantik">Semantik</a> unterscheiden:

</p>

<ul><li>Telefonnummern</li>

<li>E-Mail-Adressen</li>

<li>Bereichsauswahl (englisch: <i>range slider</i>)</li>

<li>Datumsauswahl</li>

<li><a href="Combobox" title="Combobox">Comboboxen</a></li></ul>

<div class="mw-heading mw-heading2"><h2 id="Erweiterte_Widgets">Erweiterte Widgets</h2></div>

<p>Durch Einsatz clientseitiger Techniken, wie beispielsweise <a href="JavaScript" title="JavaScript">JavaScript</a>, bieten viele <a href="Webframework" title="Webframework">Webframeworks</a> erweiterte Eingabemöglichkeiten an. Dazu zählen unter anderem <a href="Widget" title="Widget">Widgets</a> wie Slider, Kalenderboxen, Comboboxen, <a href="Farbw%C3%A4hler" title="Farbwähler">Farbwähler</a> oder <a href="Drag_and_Drop" title="Drag and Drop">Drag-and-Drop</a>-Felder.

</p><p>Einige typische <a href="Webframework" title="Webframework">Webframeworks</a> zu diesem Zweck sind:

</p>

<ul><li><a href="Dojo_Toolkit" title="Dojo Toolkit">Dojo Toolkit</a> – JavaScript-Framework zur Entwicklung von JavaScript-/Ajax-basierten Anwendungen</li>

<li><a href="JQuery_UI" title="JQuery UI">jQuery UI</a> – JavaScript-Framework zur Funktionserweiterung der <a href="Benutzerschnittstelle" title="Benutzerschnittstelle">Benutzerschnittstelle</a> auf Basis von <a href="JQuery" title="JQuery">jQuery</a></li>

<li><a href="Apache_Wicket" title="Apache Wicket">Apache Wicket</a> – Web-Framework als Basis für die Entwicklung von <a href="Webapplikation" class="mw-redirect" title="Webapplikation">Webapplikationen</a> auf einem Java-Applikationsserver</li>

<li><a href="JavaServer_Faces" class="mw-redirect" title="JavaServer Faces">JavaServer Faces</a> – Web-Framework als Basis für die Entwicklung von Webapplikationen auf einem Java-Applikationsserver</li>

<li><a href="Ext_JS" title="Ext JS">Ext JS</a> – JavaScript- bzw. Ajax-Framework für interaktive Webanwendungen</li></ul>

<div class="mw-heading mw-heading2"><h2 id="Verwendung">Verwendung</h2></div>

<p>Neben Suchmaschinen und Webmailern gibt es noch <a href="Elektronischer_Handel#Onlineshop" title="Elektronischer Handel">Onlineshops</a>, die Formulare für die Korrektur der <a href="Postanschrift" title="Postanschrift">Adress</a>- und <a href="Konto" title="Konto">Konto</a>daten anbieten. Auch werden Webformulare für Bestellung von <a href="Newsletter" title="Newsletter">Newslettern</a> für die <a href="Personalisierung_(Informationstechnik)" title="Personalisierung (Informationstechnik)">Personalisierung</a> oder das <a href="Hochladen" class="mw-redirect" title="Hochladen">Hochladen</a> von <a href="Datei" title="Datei">Dateien</a> eingesetzt. Formulare werden eingesetzt, um <a href="Kommunikation" title="Kommunikation">Kommunikation</a> ohne eine Angabe einer <a href="E-Mail-Adresse" title="E-Mail-Adresse">E-Mail-Adresse</a> durchzuführen. Dabei kann <a href="Spam" title="Spam">Spam</a> zum Beispiel durch <a href="Captcha" title="Captcha">Captchas</a> größtenteils ausgeschlossen werden. Prinzipiell ist jede Seite, die ein Radio-, Checkbox- oder Button-Element anzeigt, ein Webformular.

</p>

<div class="mw-heading mw-heading2"><h2 id="Beispiel">Beispiel</h2></div>

<p>Der folgende <a href="Hypertext_Markup_Language" title="Hypertext Markup Language">HTML</a>-Quelltext bindet eine <a href="Wikipedia" title="Wikipedia">Wikipedia</a>-Suche in die entsprechende Stelle der <a href="Webseite" title="Webseite">Webseite</a> ein.

</p>

<div class="mw-highlight mw-highlight-lang-html mw-content-ltr" dir="ltr"><pre><span></span><span class="p"><</span><span class="nt">form</span> <span class="na">action</span><span class="o">=</span><span class="s">"http://de.wikipedia.org/wiki/Spezial:Suche"</span><span class="p">></span>

<span class="p"><</span><span class="nt">fieldset</span><span class="p">></span>

<span class="p"><</span><span class="nt">legend</span><span class="p">></span>Suchen<span class="p"></</span><span class="nt">legend</span><span class="p">></span>

<span class="p"><</span><span class="nt">input</span> <span class="na">type</span><span class="o">=</span><span class="s">"text"</span> <span class="na">name</span><span class="o">=</span><span class="s">"search"</span> <span class="na">value</span><span class="o">=</span><span class="s">""</span> <span class="p">/></span>

<span class="p"><</span><span class="nt">input</span> <span class="na">type</span><span class="o">=</span><span class="s">"submit"</span> <span class="na">name</span><span class="o">=</span><span class="s">"go"</span> <span class="na">value</span><span class="o">=</span><span class="s">"Artikel"</span><span class="p">/></span>

<span class="p"><</span><span class="nt">input</span> <span class="na">type</span><span class="o">=</span><span class="s">"submit"</span> <span class="na">name</span><span class="o">=</span><span class="s">"fulltext"</span> <span class="na">value</span><span class="o">=</span><span class="s">"Volltext"</span> <span class="p">/></span>

<span class="p"></</span><span class="nt">fieldset</span><span class="p">></span>

</pre></div>

<div class="mw-heading mw-heading2"><h2 id="Weblinks">Weblinks</h2></div>

<div class="sisterproject" style="margin:0.1em 0 0 0;"><span class="noviewer" style="display:inline-block; line-height:10px; min-width:1.6em; text-align:center;" aria-hidden="true" role="presentation"><span class="mw-default-size" typeof="mw:File"><span title="Wiktionary"></span></span></span><b><a href="https://de.wiktionary.org/wiki/Webformular" class="extiw external" title="wikt:Webformular">Wiktionary: Webformular</a></b> – Bedeutungserklärungen, Wortherkunft, Synonyme, Übersetzungen</div>

<ul><li><a rel="nofollow" class="external text" href="https://wiki.selfhtml.org/wiki/HTML/Tutorials/Formulare">Webformulare</a> im <a href="Selfhtml" title="Selfhtml">Selfhtml</a>-Wiki</li>

<li><a rel="nofollow" class="external text" href="https://www.heise.de/ix/artikel/Auswahlscheibe-1667689.html"><i>Bessere Formulare dank HTML5 und CSS3</i>.</a> In: <i><a href="IX_%E2%80%93_Magazin_f%C3%BCr_professionelle_Informationstechnik" title="IX – Magazin für professionelle Informationstechnik">iX</a></i></li></ul>

<div class="mw-heading mw-heading2"><h2 id="Einzelnachweise">Einzelnachweise</h2></div>

</li>

</ol></div><div><div class="zim-footer">

Dieser Artikel wurde von <a class="external text" title="Zuletzt bearbeitet am 2025-11-05" href="https://de.wikipedia.org/wiki/?title=Webformular&oldid=261275596">Wikipedia</a> herausgegeben. Der Text ist unter <a class="external text" href="https://creativecommons.org/licenses/by-sa/4.0/deed.de">Creative Commons Attribution-Share Alike 4.0</a> verfügbar, sofern nicht anders angegeben. Für die Mediendateien können zusätzliche Bedingungen gelten.

</div>

</div></div>

</div>

</main>

</div>

</body></html>